import React, { Component } from 'react'
import Socket from '@utils/socket';

export class Active extends Component<any, any> {
  state = {
    count: 0
  };
  connect:any = null;
  constructor(props) {
    super(props);

    //手机摇一摇触发事件
    var myShakeEvent = new Shake({
      threshold: 15
    });

    // start listening to device motion
    myShakeEvent.start();
    // register a shake event
    window.addEventListener('shake', this.shakeEventDidOccur, false);
    this.connect = new Socket({
      url: 'http://127.0.0.1:3006/clint',
      onMessage: this.onMessage,
      onConnectMessage: this.onConnectMessage,
    });
  }

  onMessage = (msg) => {
    console.log('in message')
    console.log(msg)
  }

  onConnectMessage = ({id}) => {
    console.log('in onConnectMessage');
    console.log(id);
    this.setState({
      chatId: id
    })
  }

  shakeEventDidOccur = () => {
    this.setState({
      count: this.state.count++
    }, () => {
      this.connect.emit('yao', this.state.count);
    })
  }

  testYao = () => {
    this.connect.emit('yao', 123);
  }

  render() {
    const { count } = this.state;
    return (
      <div>
        { count }

        <button onClick={this.testYao}>test</button>
      </div>
    )
  }
}

export default Active
